/**
 * Emoji搜索功能
 * 用于账本、分类和子分类的emoji图标选择
 */

// 存储emoji数据
var emojiData = {};
// 存储所有可用的emoji
var allEmojis = [];
// 默认的emoji数据
var defaultEmojis = [];

// 加载emoji数据
function loadEmojiData() {
    return fetch('/js/emoji.json')
        .then(response => response.json())
        .then(data => {
            emojiData = data;
            // 提取所有emoji
            allEmojis = Object.values(data);
            // console.log('Emoji数据加载成功', emojiData, allEmojis);
        })
        .catch(error => {
            console.error('加载Emoji数据失败:', error);
        });
}

/**
 * 初始化emoji搜索功能-初始操作
 * @param {string} searchInputSelector - 搜索输入框的选择器
 * @param {string} containerSelector - 图标容器的选择器
 * @param {string} emptyShowSelector - 空提示语的选择器
 * @param {string} default_emoji - 默认显示第一个选中的emoji，因为编辑的时候需要选择原来选择的
 */
function initEmojiSearch(searchInputSelector, containerSelector, emptyShowSelector, default_emoji = '📘') {
    if (!allEmojis || allEmojis.length <= 0) {
        loadEmojiData().then(() => {
            initEmojiSearchDo(searchInputSelector, containerSelector, emptyShowSelector, default_emoji)
        })
    } else {
        initEmojiSearchDo(searchInputSelector, containerSelector, emptyShowSelector, default_emoji)
    }
}

/**
 * 初始化emoji搜索功能-后置操作
 * @param {string} searchInputSelector - 搜索输入框的选择器
 * @param {string} containerSelector - 图标容器的选择器
 * @param {string} emptyShowSelector - 空提示语的选择器
 * @param {string} default_emoji - 默认显示第一个选中的emoji，因为编辑的时候需要选择原来选择的
 */
function initEmojiSearchDo(searchInputSelector, containerSelector, emptyShowSelector, default_emoji = '📘') {
    const searchInput = document.querySelector(searchInputSelector);
    if (!searchInput) return;

    const container = document.querySelector(containerSelector);
    if (!container) return;

    const empty_show = document.querySelector(emptyShowSelector);

    // 生成默认的emoji
    makeDefaultEmojis(default_emoji);
    // 初始化emoji
    renderEmojiList(container, defaultEmojis, empty_show, true)
    searchInput.value = '';

    // 监听搜索输入框的输入事件
    searchInput.addEventListener('input', function() {
        const searchTerm = this.value.trim().toLowerCase();

        if (searchTerm === '') {
            // 如果搜索词为空，显示所有原始图标
            renderEmojiList(container, defaultEmojis, empty_show)
            return;
        }

        // 搜索匹配的emoji
        searchEmoji(searchTerm, container, empty_show);
    });
}

function renderEmojiList(iconContainer, emojis, empty_show, select_first = false) {
    if (emojis.length > 0) {
        // 清空现有图标
        empty_show.style = 'display:none';
        iconContainer.innerHTML = '';

        // 添加匹配的emoji
        emojis.forEach(emoji => {
            const iconOption = document.createElement('div');
            iconOption.className = 'emoji-option';
            iconOption.setAttribute('data-icon', emoji);
            iconOption.textContent = emoji;

            // 添加点击事件
            iconOption.addEventListener('click', function() {
                $('.emoji-option').removeClass('selected');
                $(this).addClass('selected');
                selectedIcon = $(this).data('icon');
            });

            iconContainer.appendChild(iconOption);
        });

        if (select_first) {
            const firstDiv = iconContainer.querySelector('div:first-child');
            firstDiv.classList.add('selected');
        }
    } else {
        // 如果没有匹配的emoji，显示提示信息
        iconContainer.innerHTML = '';
        empty_show.style = 'display:block';
    }
}

/**
 * 搜索匹配的emoji
 * @param {string} searchTerm - 搜索词
 * @param {Element} container - 图标容器元素
 * @param {Element} empty_show - 空提示语容器元素
 */
function searchEmoji(searchTerm, container, empty_show) {
    // 如果emoji数据为空，则不执行搜索
    if (Object.keys(emojiData).length === 0) {
        console.warn('Emoji数据尚未加载完成');
        return;
    }

    // 创建反向映射：emoji -> 名称数组
    const emojiToNames = {};
    for (const [name, emoji] of Object.entries(emojiData)) {
        if (!emojiToNames[emoji]) {
            emojiToNames[emoji] = [];
        }
        emojiToNames[emoji].push(name);
    }

    // 查找匹配的emoji
    const matchedEmojis = [];
    for (const [name, emoji] of Object.entries(emojiData)) {
        if (name.toLowerCase().includes(searchTerm)) {
            matchedEmojis.push(emoji);
        }
    }

    // 如果有匹配的emoji但不在当前显示的图标中，则动态添加
    renderEmojiList(container, matchedEmojis, empty_show)
}

/**
 * 重置所有图标的可见性
 * @param {string} first - 搜索词
 * @param {int} length - 返回最大长度
 */
function makeDefaultEmojis(first = null, length = 18) {
    if (first) defaultEmojis.unshift(first)
    allEmojis.slice(0, length).forEach(icon => {
        if (icon !== first) defaultEmojis.push(icon)
    });
    defaultEmojis = defaultEmojis.slice(0, length)
}
